<div class="monitor-tab-div">
	<!-- 基本信息 -->
	<div class="m-panel">
		<div class="m-panel-title">
			<span>基本信息</span>
		</div>
		<div class="m-panel-body base-info-div">
			<form class="bs-example form-horizontal xs-form">
				<div id="base_info_monitor_div">
					<div class="form-group">
	                    <label class="col-lg-2 control-label">监控器名称：</label>
	                    <label class="col-lg-4 control-label tl" data-id="monitorName"></label>
	                    <label class="col-lg-2 control-label">监控器类型：</label>
	                    <label class="col-lg-4 control-label tl" data-id="monitorTypeName"></label>
	                </div>
	            </div>
	            <div id="base_info_asset_div">
	                <div class="form-group">
	                    <label class="col-lg-2 control-label">被监控资产名称：</label>
	                    <label class="col-lg-4 control-label tl" data-id="assetName"></label>
	                    <label class="col-lg-2 control-label">资产类型：</label>
	                    <label class="col-lg-4 control-label tl" data-id="assetTypeName"></label>
	                </div>
	                <div class="form-group">
	                    <label class="col-lg-2 control-label">IP：</label>
	                    <label class="col-lg-4 control-label tl" data-id="mainIpv4"></label>
	                    <label class="col-lg-2 control-label">安全域：</label>
	                    <label class="col-lg-4 control-label tl" data-id="securityDomainName"></label>
	                </div>
	                <div class="form-group">
	                    <label class="col-lg-2 control-label">操作系统：</label>
	                    <label class="col-lg-4 control-label tl" data-id="osTypeName"></label>
	                    <label class="col-lg-2 control-label">物理位置：</label>
	                    <label class="col-lg-4 control-label tl" data-id="locationCbName"></label>
	                </div>
				</div>
			</form>
		</div>
	</div>

	<div class="mt5 mb5" style="height:30px">
	    <select class="form-control input-sm" data-type="select" id="url_sel">
	    </select>
	</div>

	<!-- 页面信息 -->
	<div class="m-panel">
		<div class="m-panel-title">
			<span>页面信息</span>
		</div>
		<div class="m-panel-body base-info-div">
			<form class="bs-example form-horizontal xs-form">
				<div id="page_info">
	                <div class="form-group">
	                    <label class="col-lg-2 control-label">响应码：</label>
	                    <label class="col-lg-4 control-label tl" data-id="resultCode"></label>
	                    <label class="col-lg-2 control-label">响应时间（ms）：</label>
	                    <label class="col-lg-4 control-label tl" data-id="responseTime"></label>
	                </div>

	                <div class="form-group">
	                    <label class="col-lg-2 control-label">是否匹配白名单：</label>
	                    <label class="col-lg-4 control-label tl" data-id="matchWhite"></label>
	                    <label class="col-lg-2 control-label">是否匹配黑名单：</label>
	                    <label class="col-lg-4 control-label tl" data-id="matchBlack"></label>
	                </div>

	                <div class="form-group">
	                    <label class="col-lg-2 control-label">页面大小（Byte）：</label>
	                    <label class="col-lg-4 control-label tl" data-id="urlPageSize"></label>
	                    <label class="col-lg-2 control-label">请求URL：</label>
	                    <label class="col-lg-4 control-label tl" data-id="urlAddress"></label>
	                </div>
	            </div>
			</form>
		</div>
	</div>

	<div class="box">
		<div class="box-item flex1">
			<div class="m-panel-title">
				<span>响应时间</span>
			</div>
			<div class="m-panel-body">
				<div id="response_time_chart_div" class="monitor-chart" style="height:210px"></div>
			</div>
		</div>
		<div class="box-item flex1">
			<div class="m-panel-title">
				<span>页面大小</span>
			</div>
			<div class="m-panel-body">
				<div id="page_size_chart_div" class="monitor-chart" style="height:210px"></div>
			</div>
		</div>
	</div>
</div>

<div class="monitor-tab-div" data-type="event"></div>

<script type="text/javascript">
$(document).ready(function (){
require([index_web_app_name + '/js/plugin/monitor/catagory/common_url.js'] ,function (common_url){

	var urlParamObj = index_query_param_get()

	view_init()

	event_init()

	function view_init()
	{
		index_form_init($("#url_sel").parent());
		urlParamObj.time = $("#query_time_label").text()
		common_url.base_info_render(urlParamObj)
		common_url.url_sel_render(urlParamObj)
	}

	function event_init(){
		$("#url_sel").change(function (){
	        urlParamObj.time = $("#query_time_label").text();
	        urlParamObj.urlConfigId =  $(this).val()
	        common_url.page_info_render(urlParamObj);
	        common_url.response_time_chart(urlParamObj);
	        common_url.page_size_chart(urlParamObj);
	    });
	}

	window.index_monitor_init = function ()
	{
		view_init()
	}

})
})
</script>